<!doctype html>
<html>
<head>
<meta charset="utf-8">
    <title>抢红包</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">     
    <meta content="yes" name="apple-mobile-web-app-capable">     
    <meta content="black" name="apple-mobile-web-app-status-bar-style">     
    <meta content="telephone=no" name="format-detection">
    <link rel="shortcut icon" href="/favicon.ico">
    <link rel="stylesheet" type="text/css" href="/H5/css/sm.min.css" />
    <link rel="stylesheet" type="text/css" href="/H5/css/reset.css" />
    <link rel="stylesheet" type="text/css" href="/H5/css/commission.css?v=2" />
</head>            
<body>
	<div class="page-group ms-controller" :controller="qpackets">
        <div class="page page-current">
            <header class="bar bar-nav">
              	<a class="icon icon-left pull-left" href="javascript:window.history.go(-1);"></a>
              	<a class="icon icon-home pull-right" href="/H5"></a>
              	<h1 class="title">抢红包</h1>
            </header>
            <div class="content" style="overflow: hidden;">
    			<div :if="@adsImg" class='cover' style="position: absolute; width: 100%;height: 100%; top: 0; background-color: #000; opacity: .5; z-index:99999">
    				<span :on-click='@remove' style="color: #fff; position: relative; top: 20px; font-size: 1rem; left: 85%">关闭</span>
    			</div>
    			<div :if="@adsImg" class="gg" style="position: absolute;z-index:999999;text-align:center;top:20%; width: 100%; margin:0 auto">
    				<a :attr="{'href':@adsLink}" style="display: block; width: 100%; height:100%;">
    					<img :attr="{'src':@adsImg}" alt="" style="width: 70%">
    				</a>
    			</div>
    			<div style="width: 100%;height:100%; top: 0; position: absolute; background: url('./images/hb-bj_02.png') center center no-repeat;background-size: cover">
    				<div class="pack" :on-click="@packetsout" style="width: 400px;height:300px; position: relative; top: 50%; left:50%; margin: -150px auto auto -200px; background: url('./images/fd_03.png') center center no-repeat;background-size: contain;" >
    				</div>
    			</div>
			</div>
        </div>
    </div>
<script type='text/javascript' src='/H5/js/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='/H5/js/sm.min.js' charset='utf-8'></script>
<script type='text/javascript' src='/H5/js/avalon.js' charset='utf-8'></script>
<script type='text/javascript' src='/H5/js/simpleStorage.js' charset='utf-8'></script>
<script type='text/javascript' src='/H5/js/mall.js?v=10' charset='utf-8'></script>
<script>
	var qpackets = avalon.define({
		$id: "qpackets",
        loading: false,
        more: false,
        q: false,
        adsLink: simpleStorage.get('adsLink'),
        adsImg: simpleStorage.get('adsImg'),
        page_num: 1,
        page_size: 10,
        packetsout: function(){
        	if( qpackets.loading ){
        		return
        	}
        	if( qpackets.q ){
        		return
        	}
        	qpackets.loading = true
            Mall.request("/api/Packetsout")
              .always(function(data){
            	  	if( data.error_code == 0 ){
            	  		$(".pack").css( 'background-image', 'url(./images/jg_03.png)' ).append('<p style="text-align: center; line-height: 300px">'+data.data.packets+' 元</p>')
            	  		qpackets.q = true;
	    			}
                    qpackets.loading = false    
              })
        },
        remove: function(){
        	$(".cover").remove();
        	$(".gg").remove();
        },
	})
	avalon.scan( document.body )
</script>
</body>
</html>